<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="Content-Type" content="text/html">
	<meta http-equiv="X-UA-Compatible" content="ie=edge,chrome=1">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
	<meta name="format-detection" content="telephone=no">
	<meta name="format-detection" content="email=no">
	<title>登录</title>
	<!--[if lt IE 9]>
        <script src="js/html5shiv.js"></script>
		<script src="js/respond.min.js"></script>
    <![endif]-->
    <script type="text/javascript" src="../assets/flexible/flexible.debug.js"></script>
    <script type="text/javascript" src="../assets/flexible/flexible_css.debug.js"></script>
    <link rel="stylesheet" type="text/css" href="../assets/swiper/css/swiper.min.css">
    <link rel="stylesheet" type="text/css" href="../css/denglu.css">
</head>
<body>
	<!-- 头部 -->
	<header class="head">
		<article><img src="../images/logo.png"></article>
		<p>
			<input type="text" name="" placeholder="搜索,请输入姓名或者关键字...">
			<img src="../images/search.png">
		</p>
		<a>登录</a>
		<aside><img src="../images/menu.png"></aside>
	</header>
	<!-- 头部结束 -->

	<!-- 导航部分 -->
	<nav class="nav">
		<ul>
			<li class="active">
				<img src="../images/icon1.png">
				<a>最新注册</a>
			</li>
			<li>
				<img src="../images/icon2.png">
				<a>最近登陆</a>
			</li>
			<li>
				<img src="../images/icon3.png">
				<a>收入排行</a>
			</li>
			<li>
				<img src="../images/icon4.png">
				<a>距离最近</a>
			</li>
		</ul>
	</nav>
	<!-- 导航结束 -->

	<main class="main">
		<div class="swiper-container">
		    <div class="swiper-wrapper">
		        <div class="swiper-slide">
		        	<section class="banner1">
						<aside><img src="../images/banner.png"></aside>
						<ul>
							<li>
								<img src="../images/heart.png">
								<a>651</a>
							</li>
							<li>
								<img src="../images/flower.png">
								<a>561</a>
							</li>
							<li>
								<img src="../images/coffee.png">
								<a>申请约见</a>
							</li>
						</ul>
						<article>
							<p>ID:1255498</p>
							<p>属于那种很漂亮的，皮肤比较白皙，五官都长得很漂亮，身材比较匀称 胸部非常丰满，性格属于温柔型的。</p>
						</article>
					</section>
					<section class="banner1 banner2">
						<aside><img src="../images/banner2.png"></aside>
						<ul>
							<li>
								<img src="../images/heart.png">
								<a>651</a>
							</li>
							<li>
								<img src="../images/flower.png">
								<a>561</a>
							</li>
							<li>
								<img src="../images/coffee.png">
								<a>申请约见</a>
							</li>
						</ul>
						<article>
							<p>ID:1255498</p>
							<p>属于那种很漂亮的，皮肤比较白皙，五官都长得很漂亮，身材比较匀称 胸部非常丰满，性格属于温柔型的。</p>
						</article>
						<div class="filter">
							<dl>
								<dt><img src="../images/filter.png"></dt>
								<dd>筛选</dd>
							</dl>
						</div>
					</section>
		        </div>
		        <div class="swiper-slide">Slide 2</div>
		        <div class="swiper-slide">Slide 3</div>
		        <div class="swiper-slide">Slide 4</div>
		    </div>
		</div>
	<!-- banner -->	
	</main>
	<div class="mengceng"></div>
	<section class="box">
		<div class="box1">
			<div class="denglu">
				<h4>登录会员</h4>
				<img src="../images/denglu1.png">
				<article class="art1">
					<p><img src="../images/shouji.png"></p>
					<input type="text" name="" placeholder="请输入您的手机号码">
				</article>
				<article class="art2">	
					<p><img src="../images/mima.png"></p>
					<input type="password" name="" placeholder="请输入您的密码">
				</article>
				<aside>
					<p><button></button><span>记住密码</span></p>
					<a>忘记密码</a>
				</aside>
				<button>登录</button>
			</div>
		</div>
	</section>	
	<section class="xinxi_box">
		<article class="xinxi">
			<div>
				<img src="../images/head.png">
				<div>
					<p><span>账号:</span><a></a></p>
					<button>修改个人信息</button>
				</div>
			</div>
			<aside>
				<a>切换账号</a>
				<a>退出登录</a>
			</aside>
		</article>
	</section>
	<section class="wangji">
		<div class="wangji1">
			<div class="wangji2">
				<h4>忘记密码</h4>
				<img src="../images/denglu1.png">
				<article class="art1">
					<p><img src="../images/shouji.png"></p>
					<input type="text" name="" placeholder="请输入您的手机号码">
				</article>
				<article class="art3">	
					<p><img src="../images/anquan.png"></p>
					<input type="text" name="" placeholder="请输入验证码">
					<button>获取</button>
					<!-- <input type="button" name="" value="获取"> -->
				</article>
				<article class="art2">	
					<p><img src="../images/mima.png"></p>
					<input type="password" name="" placeholder="请输入新密码">
				</article>
				<button>找回</button>
				<a>记起密码,返回登录</a>
			</div>
		</div>
	</section>	
	<div class="list">
		<section>
			<ul>
				<li>
					<span></span>
					<a>首页</a>
					<p>
						<span>H</span>
						<span>OME PAGE</span>
					</p>
				</li>
				<li>
					<span></span>
					<a href="xunyuan.html">寻缘</a>
					<p>
						<span>F</span>
						<span>IND FATE</span>
					</p>
				</li>
				<li>
					<span></span>
					<a href="xueguan.html">雅缘学馆</a>
					<p>
						<span>C</span>
						<span>OLLEGE</span>
					</p>
				</li>
				<li>
					<span></span>
					<a>情感咨询</a>
					<p>
						<span>C</span>
						<span>ONSULTATION</span>
					</p>
				</li>
				<li>
					<span></span>
					<a>爱情占卜</a>
					<p>
						<span>L</span>
						<span>OVE DIVINATION</span>
					</p>
				</li>
				<li>
					<span></span>
					<a href="hezuo.html">合作商家</a>
					<p>
						<span>C</span>
						<span>OOPERATION</span>
					</p>
				</li>
				<li>
					<span></span>
					<a href="mine.html">我的中心</a>
					<p>
						<span>M</span>
						<span>Y CENTER</span>
					</p>
				</li>
			</ul>
		</section>
	</div>
	<div class="mengceng2"></div>
	<script type="text/javascript" src="../assets/jquery/jquery-3.2.1.min.js"></script>
	<script type="text/javascript" src="../assets/swiper/js/swiper.min.js"></script>
	<script type="text/javascript" src="../js/denglu.js"></script>
	<script type="text/javascript">
		var mySwiper = new Swiper ('.swiper-container', {
		    direction: 'horizontal',
		    loop: false,
		    resistanceRatio : 0.75,
		    onSlideChangeStart: function(swiper){
      			$('.nav ul li').eq(mySwiper.activeIndex).addClass('active').siblings().removeClass('active')
    		}
  		}) 
  		$('.nav ul li').click(function(){
  			$('.active').removeClass('active')
  			$(this).addClass('active')
  		})
  		$('.nav ul li').click(function(){
  			mySwiper.slideTo($(this).index(), 800, true)
  		})
	</script>
</body>
</html>